Ext.onReady(function(){
	Ext.QuickTips.init();
	//上部按钮和菜单
	var themeMenu = new Ext.menu.Menu({
		id:'themeMenu',
		items : [{
					text : '<font size=2>皮肤设置</font>',
					iconCls : 'bugIcon',
					handler : function() {
						Ext.Msg.alert('tip',"this is my message");
					}
				}, {
					text : '<font size=2>布局设置</font>',
					iconCls : 'app_rightIcon',
					handler : function() {
					}
				}]
	});
	
	var themeButton = new Ext.Button({
		text : '<font size=2>主题</font>',
		iconCls : 'themeIcon',
		iconAlign : 'left',
		scale : 'medium',
		width : 50,
		tooltip : '<span style="font-size:12px">切换系统主题样式</span>',
		pressed : true,
		arrowAlign : 'right',
		renderTo : 'themeDiv',
		menu: themeMenu,
		hidden:true
	});
	
	var mainMenu = new Ext.menu.Menu({
		id : 'mainMenu',
		items : [{
					text : '<font size=2>密码修改</font>',
					iconCls : 'keyIcon',
					handler : function() {
					}
				}, {
					text : '<font size=2>系统锁定</font>',
					iconCls : 'lockIcon',
					handler : function() {
					}
				}]
	});
	var configButton = new Ext.Button({
		text : '<font size=2>首选项</font>',
		iconCls : 'config2Icon',
		iconAlign : 'left',
		scale : 'medium',
		width : 50,
		tooltip : '<span style="font-size:12px">首选项设置</span>',
		pressed : true,
		renderTo : 'configDiv',
		menu : mainMenu,
		hidden:true
	});
	var closeButton = new Ext.Button({
		iconCls : 'cancel_48Icon',
		iconAlign : 'left',
		scale : 'medium',
		width : 30,
		tooltip : '<span style="font-size:12px">切换用户,安全退出系统</span>',
		pressed : true,
		arrowAlign : 'right',
		renderTo : 'closeDiv',
		handler : function() {
			window.location.href="logout.action";
		}
	});
	
	
	//左侧树面板
	var leftTreePanel = new Ext.tree.TreePanel({
		autoWeight:true,
		autoScroll:true,
		lines:false,
		useArrows:true,
		border:false,
		rootVisible:false,
		style:'color:#fff;',
		root:{
			text:'',
			draggable:false,
			id:'-1',
			leaf:false,
			expanded:true
		},
		dataUrl:'json/navtree.json',
		listeners:{
			click:function(node){
				if(node.leaf == true){
					var id = node.attributes.id;
					var title = node.attributes.alias;
					var url = node.attributes.url;
					addTabPage(id,title,url);
				}
			}
		}
	});
	leftTreePanel.expandAll();
	
	//左侧树面板
	var leftTreePanel02 = new Ext.tree.TreePanel({
		autoWeight:true,
		autoScroll:true,
		lines:false,
		useArrows:true,
		border:false,
		rootVisible:false,
		style:'color:#fff;',
		root:{
			text:'',
			draggable:false,
			id:'-1',
			leaf:false,
			expanded:true
		},
		dataUrl:'json/navtree02.json',
		listeners:{
			click:function(node){
				if(node.leaf == true){
					var id = node.attributes.id;
					var title = node.attributes.alias;
					var url = node.attributes.url;
					addTabPage(id,title,url);
				}
			}
		}
	});
	leftTreePanel02.expandAll();
	
	var leftPanel = new Ext.Panel({
		title:'<font size=2>系统导航</font>',
		region:'west',
		split:true,
		collapsible: true,
		width:220,
		minSize: 200,
		maxSize: 350,
		layout:'accordion',
		defaults:{
			border:false
		},
		layoutConfig:{
			bodyStyle:'padding:5px 5px 5px 5px',
			animate:false ,
			titleCollapse:true,
			activeOnTop:false 
		},
		items:[{
				   title:'<font size=2>系统管理</font>',
				   iconCls:'folder_wrenchIcon',
				   items:[leftTreePanel]
			  },{
			  	 title:'<font size=2>车辆管理</font>',
				   iconCls:'folder_wrenchIcon',
				   items:[leftTreePanel02]
			  }]
	});
	
	
	//主内容区域面板
	var centerTabPanel = new Ext.TabPanel({
		activeTab:0,
		animScroll:true,
		enableTabScroll:true,
		border:false,
		id:'centerTabPanel',
		items:[]
	});
	
	
	(function(){
		first =	centerTabPanel.add({
	       		id:"firstTabPanel",
	            title:"我的工作台",
	            iconCls:'folder_userIcon',
	            html : '<iframe id="myframe" name="myframe" scrolling="auto" frameborder="0" width="100%" height="100%" allowtransparency="yes"  src="dev/firstPanelPage.action"></iframe>'
			});
		centerTabPanel.setActiveTab(first);
	})();
	
	function addTabPage(id,title,url){
		var tabs = centerTabPanel.getComponent(id);
		if(!tabs){
			tabs =	centerTabPanel.add({
	       		id:id,
	            title:title, 
	            html : '<iframe id="myframe" name="myframe" scrolling="auto" frameborder="0" width="100%" height="100%" allowtransparency="yes"  src="'+url+'"></iframe>',
	            closable:true
			});
		}
		centerTabPanel.setActiveTab(tabs);
	}
	
	new Ext.Viewport({
		layout:'border',
		items:[
			{
				contentEl:'north',
				region:'north',
				border:false,
				autoHeight:true
			},leftPanel,{
				region:'center',
				id:'centerPanel',
				layout:'fit',
				items:[centerTabPanel]
			},{
				region:'south',
				border:false,
				contentEl:'south',
				autoHeight:true
			}
		]
	});
});

/**
 * 显示系统时钟
 */
function showTime(){
	var date = new Date();
	this.year = date.getFullYear();
	this.month = date.getMonth() + 1;
	this.date = date.getDate();
	this.day = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六")[date.getDay()];
	this.hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
	this.minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
	this.second = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
	var currentTime = "今天是:" + this.year + "年" + this.month + "月" + this.date + "日 " +  this.day +" " + this.hour + ":" + this.minute + ":" + this.second ;
	document.getElementById('rTime').innerHTML = currentTime;
}

function abc(){
	return Ext.getCmp('centerTabPanel');
}

window.onload = function() {
	setInterval("showTime()", 1000);
};